<template>
  <div class="all">
    <header>
      <div @click="back()">
        <img src="../../assets/返回.png" alt="">
        <span class="sides" style="color: #1da4f2">返回</span>
      </div>
    </header>
    <div class="content">
      <vue-qr :logo-src="logoSrc"
              :size="191"
              :margin="0"
              :auto-color="true"
              :dot-scale="1"
              :text="appSrc" />
    </div>
  </div>
</template>

<script>
import VueQr from 'vue-qr'
import $ from 'jquery'
import videoHttp from '../../http/video.http'
export default {
  name: 'QRcode',
  components: {
    VueQr
  },
  data () {
    return {
      logoSrc: '',
      appSrc: '',
      mzhm: '',
      userid: ''
    }
  },
  mounted () {
    console.log(videoHttp.Http)
    // 从网址上截取 userid 后面的值
    this.userid = this.$utils.getUrlKey('userid')
    this.mzhm = this.$utils.getUrlKey('mzhm')
    this.appSrc =
      videoHttp.Http + 'vue_kfhl/#/persons?userid=' + this.userid + '&mzhm=' + this.mzhm + '&show=0&time=' + Date.parse(new Date())
    console.log(this.appSrc)
    var height = $(window).height() - $('.content').offset().top + 'px'
    $('.content').css('height', height)
  },
  methods: {
    back () {
      window.history.go(-1)
    }
  }
}
</script>

<style scoped>
  header{
    height: 12vw;
    /*border-bottom: 1px solid #999;*/
  }
  header div {
    height: 100%;
    display: flex;
    align-items: center;
  }
  header img{
    width: 7px;
    height: 13px;
    margin-left: 15px;
    margin-right: 5px;
  }
  header span{
    font-size: 15px;
  }
  .sides{
    font-size: 15px;
    font-family: PingFang SC;
    font-weight: bold;
  }
  .content{
    width: 100%;
    /*height: 92vh;*/
    display: flex;
    align-items: center;
    justify-content: center;
    /*border: 1px solid;*/
  }
</style>
